/**
 * Created by python on 19-2-28.
 */
let vm = new Vue({
    el: '#app',
    data: {
        host:HOST ,
        user_id: sessionStorage.user_id || localStorage.user_id,
        token: sessionStorage.token || localStorage.token,
        spit: null,
        page:1,
        page_size:5,
        count:0,

    },
    computed: {
        total_page: function(){  // 总页数
            return Math.ceil(this.count/this.page_size);
        },
        next: function(){  // 下一页
            if (this.page >= this.total_page) {
                return 0;
            } else {
                return this.page + 1;
            }
        },
        previous: function(){  // 上一页
            if (this.page <= 0 ) {
                return 0;
            } else {
                return this.page - 1;
            }
        },
        page_nums: function(){  // 页码
            // 分页页数显示计算
            // 1.如果总页数<=5
            // 2.如果当前页是前3页
            // 3.如果当前页是后3页,
            // 4.既不是前3页，也不是后3页
            var nums = [];
            if (this.total_page <= 5) {
                for (var i=1; i<=this.total_page; i++){
                    nums.push(i);
                }
            } else if (this.page <= 3) {
                nums = [1, 2, 3, 4, 5];
            } else if (this.total_page - this.page <= 2) {
                for (var i=this.total_page; i>this.total_page-5; i--) {
                    nums.push(i);
                }
            } else {
                for (var i=this.page-2; i<this.page+3; i++){
                    nums.push(i);
                }
            }
            return nums;
        }
    },
    mounted: function(){
        this.get_spits()
    },
    methods: {
        get_spits:function () {
            axios.get(this.host+'/spit/',{
            params:{
                page: this.page,
                page_size: this.page_size,
            },
            headers: {
                'Authorization': 'JWT ' + this.token
                },
                responseType: 'json',
                withCredentials: true
            })
            .then(response=>{
                console.log(response.data);
                this.count = response.data.count
                this.spit = response.data.results;
            })
            .catch(error =>{
                console.log(error.response.data)
            })

        },
        like_spit:function (spit_id) {
            axios.post(this.host+'/spit/spitlike/'+spit_id+'/',{

                },
                {
                    headers: {
                        'Authorization': 'JWT ' + this.token
                        },
                        responseType: 'json',
                        withCredentials: true
                })
                .then(response=>{
                    this.get_spits();
                    layer.msg(response.data.msg);
                })
                .catch(error =>{
                    layer.msg(error.data.msg);
                })
        },
        on_page: function(num){
            if (num != this.page){
                this.page = num;
                this.get_spits();
            }
        },
        spit_collect:function (spit_id) {
            axios.post(this.host+'/spit/spitcollection/',{
                user: this.user_id,
                collect_type: 2,
                spit: spit_id,
            },
            {
                headers: {
                    'Authorization': 'JWT ' + this.token
                    },
                responseType: 'json',
                withCredentials: true
            })
            .then(response=>{
                console.log(response.status)
                layer.msg('收藏成功');
            })
            .catch(error =>{
                if(error.response.status==400){
                    layer.msg('取消收藏');
                }
                else {
                    layer.msg('收藏失败');
                }
            })
        },
    },

});

Vue.filter('date2hm', function (value) {
    return value.getHours()+ ":" +value.getMinutes();
});